<!--添加修改角色信息-->
<template>
    <a-modal v-model="showAddTable" :mask-closable="false" :closable="true" :width="900"
             :title="title ? '实验室申请' : '查看申请'"
             :maskClosable="false"
             :destroyOnClose="true" @cancel="cancelApply">
        <a-form :form="form" @keydown.native.enter.prevent="saveApply" class="modelSearch">
          <a-form-item label="申请实验室：" prop="labId" ref="labId" v-bind="formStyle">

            <a-input
                :disabled="!title"
                placeholder="请输入实验室" ref="re"
                v-decorator="[
                        'labname',
                        {
                            rules: [
                                { required: true, message: '请输入汉字、字母、数字、_或-字符' },
                                { validator: this.verify.validateName.bind(this) }
                            ],
                            getValueFromEvent: event => {
                                return this.verify.formalSpace(event)
                            }
                        }
                    ]"
            />
          </a-form-item>
            <a-form-item label="申请人：" prop="name" v-bind="formStyle">
                <a-input
                        :disabled="!title"
                        placeholder="请输入角色名称" ref="re"
                        v-decorator="[
                        'name',
                        {
                            rules: [
                                { required: true, message: '请输入汉字、字母、数字、_或-字符' },
                                { validator: this.verify.validateName.bind(this) }
                            ],
                            getValueFromEvent: event => {
                                return this.verify.formalSpace(event)
                            }
                        }
                    ]"
                />
            </a-form-item>
            <a-form-item label="授权起止时间：" prop="limited" v-bind="formStyle">
              <a-date-picker
                  :disable="!title"
                  showTime
                  format="YYYY-MM-DD HH:mm:ss"
                  v-model="authorizeStartTime"
                  placeholder="授权开始时间"
                  style="width: 48%; float: left"
              />
              <span style="width: 5%; text-align: center">至</span>
              <a-date-picker
                  :disable="!title"
                  showTime
                  format="YYYY-MM-DD HH:mm:ss"
                  v-model="authorizeEndTime"
                  placeholder="授权结束时间"
                  style="width: 47%; float: right"
              />
            </a-form-item>

            <a-form-item label="申请原因：" prop="applyReason" v-bind="formStyle">
                <a-textarea v-decorator="['applyReason',{   rules: [{validator:this.verify.validateDescripte.bind(this)}],
                               getValueFromEvent: (event) => {
                                   return this.verify.formalhundredSpace(event)
                               }
                            }]" :rows="2" placeholder="请输入描述"/>
            </a-form-item>
        </a-form>
        <div slot="footer">
            <a-button type="default" size="default" @click="cancelApply()">取消</a-button>
            <a-button type="primary" size="default" @click="saveApply()">确定</a-button>
        </div>
    </a-modal>
</template>

<script>
    import verify from 'libs/verify'
    import AFormItem from 'ant-design-vue/es/form/FormItem'
    export default {
        name: 'applyLab',
        components: {
            AFormItem,
        },
        data () {
            return {
                verify,
                form: this.$form.createForm(this),
                showAddTable: false,
                input: false,
                originalData: {},
                selectedNode: {},
                orgTreeData: [],
              authorizeStartTime: '',
              authorizeEndTime: '',
              applyReason: '',
              stuCardId: '',
              isSuperAdmin:sessionStorage.getItem('user') === 'superAdmin',
              isStudent:sessionStorage.getItem('roleIds').indexOf('bf87a2d6702c3ee927f113806e7a9736') > 0,
              isTeacher:sessionStorage.getItem('roleIds').indexOf('c2eb3ed226c8d4f52d9203ead594817d') > 0,
            }
        },
        computed: {
            formStyle() {
                return this.$store.state.common.formStyle
            }
        },
        props: {
            title: {
                type: Boolean,
                required: true
            }
        },
        watch: {
        },
        methods: {
            /**
             * Function    : saveApply
             * Description : 打开弹框
             * Input       : none
             * Return      : none
             */
            showModal () {
                this.showAddTable = true
            },
            /**
             * Function    : showEdit
             * Description : 编辑时显示
             * Input       : opt单个所有数据
             * Return      : none
             */
            showEdit ( opt ) {
                this.showAddTable = true
                this.id = opt.id
                this.$nextTick (() => {
                    this.form.setFieldsValue (this.$pick (opt, [ 'name', 'applyReason', 'authorizeStartTime','authorizeEndTime','stuCardId' ]))
                })
            },

            /**
             * Function    : saveApply
             * Description : 角色信息新增、编辑保存
             * Input       : name
             * Return      : none
             */
            saveApply ( ) {
                this.form.validateFields((err, value) => {
                    if (!err) {
                        let para = {}
                        para.name = value.name
                        para.applyReason = value.applyReason
                        para.authorizeStartTime = value.authorizeStartTime
                        para.authorizeEndTime = value.authorizeEndTime
                        para.stuCardId = value.stuCardId
                        if (this.title) {
                            this.$store.dispatch ('saveApplyLabAct', para).then (response => {
                                this.showAddTable = false
                                if (response.code === 0) {
                                    this.$emit ('init')
                                    this.$message.success (response.message)
                                } else {
                                    this.$message.error (response.message)
                                }
                            })
                        }
                      this.showAddTable = false
                    }
                })
            },

            /**
             * Function    : cancelApply
             * Description : 取消弹出框
             * Input       : val
             * Return      : none
             */
            cancelApply ( ) {
                this.showAddTable = false
                let _this = this
                setTimeout(function() {
                    _this.form.resetFields()
                }, 100)
            },

        },

        created () {

        }
    }
</script>
